Ext.define('Admin.common.container.WizardContainer', {
    extend: 'Admin.common.container.BaseContainer',
    alias: 'widget.wizardContainer',
    cls: 'dashboard-main-chart shadow',
    layout: {
        type: 'vbox',
        align: 'stretch'
    },
    height: 200,
    autoLoad: true,
    config: {
        currentStep: 0
    },
    initComponent: function() {
        /*$.get('http://123.85.3.50:8079/jsite-szy-dispatch/a/emergency/ddsEdEvent/listAll',function(data){

        });*/

        var self = this;
        var stepWidth = self.stepWidth;
        if (!stepWidth) {
            stepWidth = 20;
        }
        var items = [];
        var stepItem = {
            xtype: 'panel',
            layout: 'anchor',
            columnWidth: 1
        };
        if (self.wizards && self.wizards.length > 0) {
            var html = [];
            html.push('<div class="wqForeacst" style="margin:20px 10px">');
            html.push('<div class="ant-steps ant-steps-horizontal ant-steps-label-horizontal">');

            Ext.Array.each(self.wizards, function(item, index) {
                var style = 'margin-right: -23px; width: ' + stepWidth + '%;';
                var clazz = ' ant-steps-status-wait';
                if (index == 0) {
                    style = 'margin-right: -50px; width: ' + stepWidth + '%;';
                    clazz = '  ant-steps-status-process';
                } else if (index == self.wizards.length - 1) {
                    clazz = ' ant-steps-item-last ant-steps-status-wait';
                    style = '';
                }

                html.push('<div class="ant-steps-item' + clazz + '" style="' + style + '">' +
                    '<div class="ant-steps-tail" style="padding-right: 22px;"><div class="step-line"></div></div>' +
                    '<div class="ant-steps-step">' +
                    '<div class="ant-steps-head">' +
                    '<div class="ant-steps-head-inner"><span class="ant-steps-icon">' + (index + 1) + '</span></div>' +
                    '</div>' +
                    '<div class="ant-steps-main">' +
                    '<div class="ant-steps-title">' + item + '</div>' +
                    '</div>' +
                    '</div>' +
                    '</div>');
            });
            html.push('</div></div>');

            stepItem.html = html.join('');
        }

        var buttons = [{
            xtype: 'button',
            itemId: 'btnBack_' + self.xtype,
            iconCls: 'x-fa fa-arrow-left',
            text: '上一步',
            disabled: true,
            handler: function() {
                // self.fireEvent('clickBack', {self:self, step:this.getCurrentStep(), test: 2});
                self.wback();
            }
        }, {
            xtype: 'button',
            itemId: 'btnNext_' + self.xtype,
            iconCls: 'x-fa fa-arrow-right',
            text: '下一步',
            handler: function() {
                self.fireEvent('clickNext');
                if (!self.method) {
                    self.wnext();
                }
            }
        }];

        if (self.xtype == 'newPlan') {
            buttons.push({
                margin: '0 0 0 10',
                xtype: 'button',
                iconCls: 'x-fa fa-chevron-left',
                handler: 'onNewPlanInfoClick'
            });
        } else if (self.xtype == 'waterQuality') {
            buttons.push({
                margin: '0 0 0 10',
                xtype: 'button',
                iconCls: 'x-fa fa-chevron-left',
                handler: 'onWaterQualityInfoClick'
            });
        }

        var stepItemCon = {
            height: 70,
            xtype: 'panel',
            layout: 'column',
            cls: 'wizard-control',
            items: [stepItem, {
                xtype: 'panel',
                id: 'wControlBtns-' + self.xtype,
                // margin: '20 0 0 30',
                bodyStyle: 'float: right;',
                width: 228,
                defaults: {
                    margin: '0 5 0 0'
                },
                items: buttons
            }]
        };
        items.push(stepItemCon);

        var card = {
            flex: 1,
            itemId: 'card-' + self.xtype,
            xtype: 'container',
            width: '100%',
            bodyStyle: 'padding:0px 10px 10px 10px',
            layout: 'card'
        };
        if (self.cardItems && self.cardItems.length > 0) {
            card.items = self.cardItems;
        }
        items.push(card);

        self.items = items;
        this.callParent(arguments);
    },
    wnext: function(itemData) {

        var me = this;
        var currentStep = me.getCurrentStep(); //获取现在的布数
        var stepItems = Ext.get(me.id).select('.ant-steps-item').elements; //获取所有的step的item

        var sta = itemData.sta && itemData.sta > 0 ? itemData.sta : 0;
        console.log(sta);
        if (currentStep === stepItems.length - 1) {
            return;
        }
        var card = me.getComponent('card-' + me.xtype); //获取到card组件

        var objId = this.getId();
        if ((Ext.util.Format.substr(objId, 0, 7) == 'newPlan' && currentStep == 2) || (Ext.util.Format.substr(objId, 0, 7) == 'waterQu' && currentStep == 1)) {
            var msg = '正在加载，请稍候...';
            if (sta < 4) { msg = '正在计算，请稍候...'; }
            Ext.Msg.show({
                title: "加载进度",
                msg: msg,
                width: 300,
                wait: true,
                waitConfig: {
                    interval: 100,
                    duration: 1000,
                    fn: function() {
                        Ext.Msg.hide();
                        Ext.Msg.alert("提示", "加载完成！");
                    }
                },
                closable: true
            });
            setTimeout(function() {
                stepItems[currentStep].className = stepItems[currentStep].className.replace(new RegExp('ant-steps-status-process'), "ant-steps-status-finish");
                currentStep = currentStep + 1; //步数加1
                stepItems[currentStep].className = stepItems[currentStep].className.replace(new RegExp('ant-steps-status-wait'), "ant-steps-status-process");
                card.setActiveItem(currentStep); //设置card的页数
                me.setCurrentStep(currentStep); //将现有的currentItem返回给config
                me.refreshBtn();
            }, 1000);
        } else {
            stepItems[currentStep].className = stepItems[currentStep].className.replace(new RegExp('ant-steps-status-process'), "ant-steps-status-finish");
            currentStep = currentStep + 1; //步数加1
            stepItems[currentStep].className = stepItems[currentStep].className.replace(new RegExp('ant-steps-status-wait'), "ant-steps-status-process");
            card.setActiveItem(currentStep); //设置card的页数
            me.setCurrentStep(currentStep); //将现有的currentItem返回给config
            me.refreshBtn();
        }
    },
    //steps上一步
    wback: function() {
        var me = this;
        var currentStep = me.getCurrentStep(); //获取现在的布数
        if (currentStep === 0) {
            return;
        }
        var card = me.getComponent('card-' + me.xtype); //获取到card组件
        var stepItems = Ext.get(me.id).select('.ant-steps-item').elements; //获取所有的step的item
        stepItems[currentStep].className = stepItems[currentStep].className.replace(new RegExp('ant-steps-status-process'), "ant-steps-status-wait");
        currentStep = currentStep - 1; //步数减1
        stepItems[currentStep].className = stepItems[currentStep].className.replace(new RegExp('ant-steps-status-finish'), "ant-steps-status-process");
        card.setActiveItem(currentStep); //设置card的页数
        me.setCurrentStep(currentStep); //将现有的currentItem返回给config

        me.refreshBtn();
    },
    refreshBtn: function() {
        var me = this;
        var currentStep = me.getCurrentStep();
        var len = me.wizards.length;
        var cmp = Ext.getCmp('wControlBtns-' + me.xtype);
        if (cmp) {
            var btnBack = cmp.getComponent('btnBack_' + me.xtype);
            var btnNext = cmp.getComponent('btnNext_' + me.xtype);
            if (currentStep == 0) {
                btnBack.setDisabled(true);
            } else if (currentStep == (len - 1)) {
                btnNext.setDisabled(true);
            } else {
                btnBack.setDisabled(false);
                btnNext.setDisabled(false);
            }
        }
    }
});